<!doctype html>
<html>

  <head>
    <meta charset="UTF-8">
    <title></title>
    <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
    <link href="../css/mui.min.css" rel="stylesheet" />
    <link href="../css/1px.css" rel="stylesheet" />
    <style type="text/css">
      html {
        font-family: Roboto, Arial, "Noto Sans CJK SC", "Noto Sans CJK TC", "Pingfang SC", "Microsoft Yahei", "WenQuanYi Micro Hei", sans-serif;
      }
      
      body {
        background-color: #fff !important;
        font-size: 14px;
      }
      .switch-select:after{
      	content: '';
      	height: 0;
      	display: block;
      	clear: both;
      }
      .switch-option {
        box-sizing: border-box;
        text-align: center;
        padding: 30px 0;
        width: 45%;
        margin: 10px 2.5%;
        float: left;
      }
      
      .switch-option:active {
        background-color: #F7F7F7;
        position: relative;
      }
      
      .no-border:active {
        background-color: #fff;
      }
      
      .bookmark {
        position: absolute;
        top: -2px;
        right: 0px;
        width: 30px;
        height: 30px;
        background-image: url(../images/bookmark.png);
        background-size: 100% 100%;
      }
    </style>
    <script src="../js/mui.min.js"></script>
    <script type="text/javascript">
      mui.init();
    </script>
  </head>

  <body>
    <div class="switch">

    </div>
    <script id="shops" type="text/html">
    	<div class="switch-select">
        <%for (var i = 0; i < list.length; i++) {%>
          <div class="switch-option vux-1px" data-id="<%=list[i].storeId%>">
            <% if (list[i].hasTask) {%>
            <div class="bookmark"></div>
            <%}%>
            <%=list[i].storeName%>
        </div>
        <%}%>
        </div>
    </script>
    <script src="../js/template-native.js" type="text/javascript" charset="utf-8"></script>
    <script src="../config.js" type="text/javascript" charset="utf-8"></script>
    <script type="text/javascript">
      var originData = {
          shops: [],
          userName: '',
          currentShop: '',
        },
        inventoryStatus = ''

      mui.plusReady(function() {
        var self = plus.webview.currentWebview();
        originData = self.originData
        getShops();
      });

      function getShopsOfUser() {
        var self = plus.webview.currentWebview();
        originData.shopObjs.forEach(function(shopObj) {
          inventoryStatus.forEach(function(shop) {
            if(shop.hasTask) {
              if(shopObj.storeId === shop.storeId) {
                shopObj.hasTask = true;
              }
            }
          });
        });
        var html = template('shops', {
          list: originData.shopObjs
        });
        mui('.switch')[0].innerHTML = html;
        bindEvent();
      }

      function getShops() {
        config.ajax({
          url: '/inventory/checkStoreTaskStatus',
          success: function(res) {
            inventoryStatus = res.inventoryStatus;
            getShopsOfUser();
          }
        });
      }

      function bindEvent() {
        mui('.switch-select').on('tap', '.switch-option', function() {
          var params = {
            storeId: this.getAttribute('data-id')
          }
          switchStore(params);
        });
      }

      function switchStore(params) {
        config.ajax({
          url: config.basePath + '/login/changeStore',
          headers: {
            'Content-Type': 'application/json'
          },
          crossDomain: true,
          dataType: 'json',
          type: 'POST',
          data: params,
          success: function(res) {
            if(res.result === 1) {
              plus.nativeUI.toast('切换成功');
              switchSuccess(res);
            } else {
              plus.nativeUI.toast(res.errormsg);
            }
          }
        });
      }

      function switchSuccess(res) {
        originData.shops = res.info.shops;
        originData.userName = res.info.info.userName;
        originData.currentShop = res.info.currentShop;
        originData.pages = res.info.phonePages
        var homePage = plus.webview.getWebviewById('index');
        mui.fire(homePage, 'changeOriginData', originData);
        mui.openWindow({
          url: '../index.html',
          id: 'index',
          extras: {
            originData: originData
          }
        });
      }
    </script>
  </body>

</html>